iT邦幫忙

2024 iThome 鐵人賽

DAY 25
0
自我挑戰組

30 天 Node.js 探索:基礎、進階與實踐系列 第 25

Day 25: 類別與標籤管理功能

  • 分享至 

  • xImage
  •  

今天將實現「類別與標籤管理」功能。這些功能將幫助用戶更有效地管理和分類他們的財務記錄。類別可用於標記不同的收支類型(如「食物」、「交通」、「娛樂」),而標籤則允許用戶進行更多維度的分類(如「生日派對」、「工作旅行」等)。

設計 Category 和 Tag 模型

首先需要定義類別(Category)和標籤(Tag)的資料模型,這些模型將與交易(Transaction)進行關聯,從而幫助用戶分類不同的財務紀錄。

Category 模型

新建 models/Category.js 來定義類別資料模型:

js
const mongoose = require('mongoose');

const categorySchema = new mongoose.Schema({
  user: { type: mongoose.Schema.Types.ObjectId, ref: 'User', required: true },
  name: { type: String, required: true },
  description: { type: String },
  createdAt: { type: Date, default: Date.now },
});

module.exports = mongoose.model('Category', categorySchema);

Tag 模型

新建 models/Tag.js 來定義標籤資料模型:

js
const mongoose = require('mongoose');

const tagSchema = new mongoose.Schema({
  user: { type: mongoose.Schema.Types.ObjectId, ref: 'User', required: true },
  name: { type: String, required: true },
  description: { type: String },
  createdAt: { type: Date, default: Date.now },
});

module.exports = mongoose.model('Tag', tagSchema);

這兩個模型都會關聯到用戶,確保每個用戶都有自己的類別和標籤資料,不會互相影響。

CRUD 操作:類別和標籤管理

接著要製作類別和標籤的 CRUD 功能(Create、Read、Update、Delete),讓用戶可以添加、查詢、修改和刪除自己的類別與標籤。

類別管理:

新增類別 (Create)
在 routes/categories.js 中創建一個 POST 路由來新增類別:

js
const express = require('express');
const auth = require('../middleware/authMiddleware');
const Category = require('../models/Category');

const router = express.Router();

// 新增類別
router.post('/', auth, async (req, res) => {
  const { name, description } = req.body;

  try {
    const category = new Category({
      user: req.user,
      name,
      description,
    });

    await category.save();
    res.status(201).json(category);
  } catch (error) {
    res.status(500).json({ msg: 'Server error' });
  }
});

module.exports = router;

查詢類別 (Read)
使用 GET 路由查詢當前用戶的所有類別:

js
// 查詢所有類別
router.get('/', auth, async (req, res) => {
  try {
    const categories = await Category.find({ user: req.user }).sort({ createdAt: -1 });
    res.json(categories);
  } catch (error) {
    res.status(500).json({ msg: 'Server error' });
  }
});

更新類別 (Update)
用戶可以更新已存在的類別資料:

js
// 更新類別
router.put('/:id', auth, async (req, res) => {
  const { name, description } = req.body;

  try {
    let category = await Category.findById(req.params.id);

    if (!category) {
      return res.status(404).json({ msg: 'Category not found' });
    }

    if (category.user.toString() !== req.user) {
      return res.status(401).json({ msg: 'Not authorized' });
    }

    category = await Category.findByIdAndUpdate(
      req.params.id,
      { name, description },
      { new: true }
    );

    res.json(category);
  } catch (error) {
    res.status(500).json({ msg: 'Server error' });
  }
});

刪除類別 (Delete)
用戶可以刪除已經存在的類別:

js
// 刪除類別
router.delete('/:id', auth, async (req, res) => {
  try {
    const category = await Category.findById(req.params.id);

    if (!category) {
      return res.status(404).json({ msg: 'Category not found' });
    }

    if (category.user.toString() !== req.user) {
      return res.status(401).json({ msg: 'Not authorized' });
    }

    await category.remove();
    res.json({ msg: 'Category removed' });
  } catch (error) {
    res.status(500).json({ msg: 'Server error' });
  }
});

標籤管理:

標籤的部分可以用類似的邏輯來實現標籤的 CRUD 功能,這裡展示一個新增標籤的範例,其他操作(查詢、更新、刪除)可依照類別的方式進行。
新增標籤 (Create)
在 routes/tags.js 中創建一個 POST 路由來新增標籤:

js
const express = require('express');
const auth = require('../middleware/authMiddleware');
const Tag = require('../models/Tag');

const router = express.Router();

// 新增標籤
router.post('/', auth, async (req, res) => {
  const { name, description } = req.body;

  try {
    const tag = new Tag({
      user: req.user,
      name,
      description,
    });

    await tag.save();
    res.status(201).json(tag);
  } catch (error) {
    res.status(500).json({ msg: 'Server error' });
  }
});

module.exports = router;

整合與測試

整合路由

在 server.js 中整合類別與標籤路由:

js
const categoryRoutes = require('./routes/categories');
const tagRoutes = require('./routes/tags');

app.use('/api/categories', categoryRoutes);
app.use('/api/tags', tagRoutes);

測試功能

使用 Postman 或其他 API 測試工具來測試 CRUD 功能:

  • 新增類別和標籤
  • 查詢所有類別和標籤
  • 更新指定的類別和標籤
  • 刪除類別和標籤

總結

今天製作了類別和標籤的管理功能,讓用戶能夠對財務記錄進行分類和標籤化管理。這些功能將幫助用戶更有條理的管理收入和支出,並通過標籤系統進行詳細的記錄分類。在接下來的開發中,會進一步完善這些功能,並結合其他特性實現更強大的個人財務管理工具。


上一篇
Day 24: 資料庫連接與中介軟體設置
下一篇
Day 26: 錯誤處理與日誌管理
系列文
30 天 Node.js 探索:基礎、進階與實踐30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言